// @ts-nocheck
/* eslint-disable */
import React, { useEffect, useState } from 'react';
import { Card, Input, Button, message, Descriptions, Space } from 'antd';
import { UserOutlined, EditOutlined, SaveOutlined, CloseOutlined } from '@ant-design/icons';
import * as customerController from '@/services/backend/customerController';
import { useModel } from '@umijs/max';
import dayjs from 'dayjs';

const ProfilePage: React.FC = () => {
  const [user, setUser] = useState<any>({});
  const [editing, setEditing] = useState(false);
  const [formData, setFormData] = useState<any>({});
  const { initialState, setInitialState } = useModel('@@initialState');

  // 获取当前用户信息
  useEffect(() => {
    async function fetchUser() {
      const res = await customerController.getCurrentCustomerInfo();
      if (res.code === 1 && res.data) {
        setUser(res.data);
        setFormData({
          userName: res.data.userName,
          telephone: res.data.telephone,
          address: res.data.address,
        });
      }
    }
    fetchUser();
  }, []);

  // 切换到编辑模式
  const handleEdit = () => {
    setEditing(true);
  };

  // 取消编辑
  const handleCancel = () => {
    setEditing(false);
    setFormData({
      userName: user.userName,
      telephone: user.telephone,
      address: user.address,
    });
  };

  // 保存
  const handleSave = async () => {
    try {
      const res = await customerController.updateCurrentCustomerInfo(formData);
      if (res.code === 1 && res.data) {
        setUser(res.data);
        setEditing(false);
        // 同步全局 currentUser，刷新右上角用户名，并同步 localStorage
        if (setInitialState) {
          setInitialState((s: any) => ({ ...s, currentUser: { ...s.currentUser, userName: res.data.userName } }));
          localStorage.setItem('currentUser', JSON.stringify({ ...JSON.parse(localStorage.getItem('currentUser') || '{}'), userName: res.data.userName }));
        }
        message.success('信息更新成功');
      } else {
        message.error(res.msg || '信息更新失败');
      }
    } catch (e) {
      message.error('信息更新失败');
    }
  };

  // 输入框变化
  const handleChange = (e: any) => {
    setFormData({
      ...formData,
      [e.target.name]: e.target.value,
    });
  };

  return (
    <Card
      title={<><UserOutlined /> 个人信息</>}
      extra={
        editing ? (
          <Space>
            <Button icon={<SaveOutlined />} type="primary" onClick={handleSave}>保存</Button>
            <Button icon={<CloseOutlined />} onClick={handleCancel}>取消</Button>
          </Space>
        ) : (
          <Button icon={<EditOutlined />} onClick={handleEdit}>编辑</Button>
        )
      }
    >
      <Descriptions column={1} bordered size="small">
        <Descriptions.Item label="用户名">
          {editing ? (
            <Input
              name="userName"
              value={formData.userName}
              onChange={handleChange}
              placeholder="请输入用户名"
            />
          ) : (
            user.userName
          )}
        </Descriptions.Item>
        <Descriptions.Item label="身份证号">{user.pid}</Descriptions.Item>
        <Descriptions.Item label="手机号">
          {editing ? (
            <Input
              name="telephone"
              value={formData.telephone}
              onChange={handleChange}
              placeholder="请输入手机号"
            />
          ) : (
            user.telephone
          )}
        </Descriptions.Item>
        <Descriptions.Item label="地址">
          {editing ? (
            <Input
              name="address"
              value={formData.address}
              onChange={handleChange}
              placeholder="请输入地址"
            />
          ) : (
            user.address
          )}
        </Descriptions.Item>
        <Descriptions.Item label="注册时间">
          {user.createTime ? dayjs(user.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}
        </Descriptions.Item>
      </Descriptions>
    </Card>
  );
};

export default ProfilePage; 